import React,{useState,useContext, useEffect} from 'react';
import ReactDOM from 'react-dom/client';
const root = ReactDOM.createRoot(document.getElementById('root'));
function Child1(){
	useEffect(()=>{
		//通过全局变量进行通信
		//window.child1Value = 'child1Value';
		//监听一个自定义事件，事件名称叫child2Event。当事件触发的时候执行回调,打印事件详情
		window.addEventListener('child2Event',(event)=>{
			console.log('child2Event',event.detail)
		});
	},[])
	return <div>Child1</div>
}
function Child2(){
	useEffect(()=>{
		//console.log('window.child1Value',window.child1Value)
		window.dispatchEvent(new CustomEvent('child2Event',{
			detail:'来自Child2的消息'
		}));
	},[])
	return <div>Child2</div>
}
function Parent(){
	return (
		<>
		 <Child1/>
		 <Child2/>
		</>
	)
}
root.render(<Parent />);